<template>
    <view>
    <view v-if="olddata == true">
        <view class="mt100 pd">
			<view class="pr fgdyuywrtrt">
				<image src="../../static/img/CHEKUANG.png" class="w100 cz bgsdetr" ></image>
				
				<image src="../../static/img/dsdfsfga.png" class="jjhhnxeer" :class="type==2?'act':''" mode="widthFix" v-if="type!==0"></image>
			</view>
			<view class="cen fz26 z9 mt20">
				2020-05-28 13:00:12
			</view>
		</view>
		
		<view class="mt100 row pd ">
			<view class="col row mr10 kkjkmmnxeet" :class="type==1?'act':''">
				<image src="../../static/img/dsdfsfgb.png" class="kkmmkertwr" mode="widthFix" v-if="type==1"></image>
				<image src="../../static/img/dfsdfa.png" class="kkmmkertwr" mode="widthFix" v-else></image>
				
				<view class="col pl20">
					<view class="fz28 cf">
						蓄电池电压
					</view>
					<view class=" mt10 cf fz32">
						<text class="fz60 b">10</text> %
					</view>
				</view>
			</view>
			
			<view class="col row ml10 kkjkmmnxeet" :class="type==2?'act':''">
				<image src="../../static/img/dsdfsfgd.png" class="ddrertww3rt" mode="widthFix" v-if="type==2"></image>
				<image src="../../static/img/dfsdfb.png" class="ddrertww3rt" mode="widthFix" v-else></image>
				
				<view class="col pl20">
					<view class="fz28 cf">
						发动机故障灯
					</view>
					<view class=" mt15 cf fz32">
						<text class="fz40 b">{{type!=2?'正常':'异常'}}</text> 
					</view>
				</view>
			</view>
		</view>
		<view class="pd mt50">
			<navigator class="kjhhxerttd" url="errorListing">
				<view class="kkjnmkeryty fz32 cf cen b">
					<image src="../../static/img/dfsdfc.png" mode="widthFix" class="kkmkjjerty cz" v-if="type==0"></image>
					<image src="../../static/img/dsdfsfgc.png" mode="widthFix" class="kkmkjjerty cz" v-else></image>
					 <text class="ml40">故障码</text>
					<text class="ml30">P0000</text>
				</view>
			</navigator>
			
			
		</view>
		
		<uni-calendar ref="calendar" :date="info.date" :insert="info.insert" :lunar="info.lunar" :startDate="info.startDate" :endDate="info.endDate" :range="info.range" @confirm="confirm" />
			
    </view>
	<view class="cen z9 fz30 cen mt100"  v-if="olddata == false">
		<view class="llknnneert pr">
			<image src="../../static/img/qs/dddda.png" class="jjjhnmnxerrta cz"></image>
			<image src="../../static/img/qs/ddddb.png" class="jjnnkxerrae"></image>
		</view>
		暂无车况记录
	</view>
	<view class="kjnnjsdfte fz36 cf" @tap="hf('physical?devsn='+devsn)" v-if="olddata == false">
		车辆体检
	</view>
    </view>
	
</template>
<script>
	import uniCalendar from '@/components/uni-calendar/uni-calendar.vue'
    export default {
        data() {
            return {
				type:0,//异常的状态  0 正常  1蓄电池电压 异常 2.发动机故障灯 异常
				kkjnxd:0,
				showCalendar: false,
				info: {
					date: '2019-08-15',
					startDate: '2019-06-15',
					endDate: '2019-010-15',
					lunar: true,
					range: true,
					insert: false,
					selected: []
				},
				olddata:false,
				devsn:0
			}
        },
		onNavigationBarButtonTap() {
			this.$refs.calendar.open()
		},
        components: {
			uniCalendar
		},
        methods: {},
		onLoad(e) {
			console.log(e);
			this.kkjnxd=e.type
			this.devsn = e.devsn
		},
        mounted() {
			this.type=Math.floor(Math.random()*3)
		}
    }

</script>
<style  scoped>
	.kkmmkertwr{
		width: 70upx;
	}
	.ddrertww3rt{
		width: 94upx;
	}
	.kjhhxerttd{
		border-top: 1px solid #2C3039;
		padding-top: 60upx;
	}
	.kkmkjjerty{
		width: 56upx;
		position: relative;
		bottom: 4upx;
	}
	.kkjnmkeryty{
		height:164upx;
		line-height: 164upx;
		background:rgba(53,60,81,1);
		border-radius:12upx;
	}
	.kjnnjsdfte{
		height:100upx;
		background:linear-gradient(180deg,rgba(27,213,185,1) 0%,rgba(22,137,213,1) 100%);opacity:1;
		border-radius:12upx;
		text-align: center;
		line-height: 100upx;
		margin-top: 68upx;
		width: 90%;
		margin: auto;
		margin-top: 40upx;
	}
	.fgdyuywrtrt{
		height: 304upx;
	}
	.fgdyuywrtrt .bgsdetr{
		height: 100%;
	}
	.jjhhnxeer{
		width: 50upx;
		position: absolute;
		right: 80upx;
		top: 120upx;
	}
	.jjhhnxeer.act{
		right: initial;
		left: 80upx;
	}
	.kkjkmmnxeet.act .cf{
		color: #FC5A5A !important;
	}
</style>
